<template>
  <div :class="[showFull?'showBullClass':'']">
    <Hearder></Hearder>

    <div id="forum_main">
      <!--      <div class="news-nav" style="position: relative; top: 0px; left: 0px; width: 100%;">
              <div class="container">
                <div class="nav-bar">
                  <a href="javascript:void(0)" class="current">论坛首页</a>
                  <a href="javascript:void(0)" class="">论坛牛人</a>
                  <a href="javascript:void(0)" class="">排行榜</a>
                  <a href="javascript:void(0)" class="">论坛地图</a>
                  <a href="javascript:void(0)" class="misson-entry ">论坛任务</a>
                  <a href="javascript:void(0)" target="_blank" class="help">
                    <i class="fa fa-question-circle"></i>论坛帮助</a>
                  <span class="totast-wrap">
                    <router-link to="/forum/write" class="to_post">我要发贴</router-link>
                  </span>
                </div>
                <div class="search-download" id="csdn_tool_otherPlace" style="float:right;"></div>
              </div>
            </div>-->

      <div class="csdn_bbs_main pad_left">

        <div class="bbs_main_wrap csdn_main_container">
          <div id="navs" style="margin-top: 0;" :style="{'position':btnFlag?'fixed':'','top':btnFlag?'47px':''}">
            <nav id="csdn-nav-second" class="clearfix">
              <div class="clearfix">
                <div class="nav_com">
                  <ul>
                    <li :class="[item.path==$route.path?'active':'']"
                        class="nav_com_li" v-for="(item,index) in activeTab" :key="index">
                      <router-link class="current" :to="item.path">{{ item.title }}</router-link>
                    </li>
                  </ul>
                  <ul class="extra-button-box">
                    <li>
                      <a href="javascript:;" @click="btnClick">我要发帖</a>
                    </li>
                  </ul>
                </div>
              </div>
            </nav>
          </div>

          <div class="bbs_left_wrap">
            <router-view @fullShow="fullShow"></router-view>
          </div>

        </div>

      </div>

    </div>

    <Footer></Footer>
    <BackTopBar></BackTopBar>
  </div>
</template>

<script>
import Hearder from '@/components/Hearder'
import Footer from '@/layout/components/Footer'
import BackTopBar from '@/layout/components/BackTopBar'
import Editor from '@/components/Editor'
import { listForum } from '@/api/forum'
import { getToken } from '@/utils/auth'
import store from '@/store'

export default {
  name: 'Forum',
  components: { BackTopBar, Hearder, Footer, Editor },
  data() {
    return {
      activeTab: [
        { path: '/forum/home', title: '论坛首页' },
        // { path: '/forum/write', title: '我要发贴' },
        // { path: '/forum/edit', title: '帖子查看' }
      ],
      // 论坛表格数据
      forumList: [],
      forumListClick: [],
      // 日期范围
      dateRange: [],
      btnFlag: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        forumTitle: undefined,
        userId: undefined,
        accept: undefined,
        report: '0',
        status: '1'
      },
      total: 0,
      showFull:false

    }
  },
  mounted() {
    window.addEventListener('scroll', this.scrollToTop, true)
  },
  created() {
    this.getList()
  },
  methods: {
    fullShow(val){
      console.log("2222",val)
      this.showFull=val
    },

    /** 查询论坛列表 */
    getList() {
      this.dateRange.push(this.getDay(-7))
      this.dateRange.push(this.getDay(0))
      listForum(this.addDateWeekRange(this.queryParams)).then(response => {
        this.forumList = response.rows
        this.total = response.total
      })
      // listForum(this.addDateRange(this.queryParams, dateRange)).then(response => {
      //   this.forumList = response.rows
      //   this.total = response.total
      // })
    },

    btnClick(){
      if (!getToken()) {
        this.$confirm('您未成功登录，您可以继续留在该页面，或者登录', '系统提示', {
            confirmButtonText: '登录',
            cancelButtonText: '取消',
            type: 'warning'
          }
        ).then(() => {
          store.dispatch('LogOut').then(() => {
            location.href = '/login'
          })
        }).catch(() => {
        })
      } else {
        this.$router.push('/forum/write')
      }
    },

    scrollToTop() {
      const that = this
      let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
      that.scrollTop = scrollTop
      if (that.scrollTop > 47) {
        that.btnFlag = true
      } else {
        that.btnFlag = false
      }
    }

  },
  destroyed() {
    // 离开页面时需销毁滚动监听事件
    window.removeEventListener('scroll', this.scrollToTop)
  }
}
</script>

<style scoped>

.showBullClass{
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.misson-entry {
  position: relative;
}

.misson-entry em {
  position: absolute;
  background-color: #FC5531;
  border-radius: 20px;
  padding: 2px 1px;
  top: 0px;
  right: -12px;
  color: #fff;
  font-size: xx-small;
  transform: scale(.9);
  vertical-align: middle;
  line-height: 14px;
  min-height: 14px;
  min-width: 19px;
  border: 1px solid #FFF;
  text-align: center;
}
</style>
